<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<head>
    <meta charset="UTF-8">
    <title>商品详细</title>

    <script src="${pageContext.request.contextPath}/js/jQuery/jquery-3.4.1.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap/dist/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/product_spec.css">

</head>
<body>


<!--========================头部===================================================-->
<div class="top">
    <div class="top-log">
        <div class="logo">
            <a href="index.html"><img src="${pageContext.request.contextPath}/images/xianyu.jpg" width="90" height="40"></a>
        </div>
    </div>
    <div class="top-dingwei">
        <div class="top-dingwei-main">
            <ul>
                <li class="top-dingwei-img"><img src="${pageContext.request.contextPath}/images/dingwei.png"></li>
                <li class="top-dingwei-city"><a href="#">深圳<p class="top-dingwei-jiantou"></p></a></li>
            </ul>
        </div>
    </div>

    <!--============================搜索=====================================-->
    <div class="search-btn">
        <form onSubmit="submitFn(this, event);">
            <div class="search-wrapper">
                <div class="input-holder">
                    <input type="text" class="search-input" placeholder="请输入关键词" />
                    <button class="search-icon" onClick="searchToggle(this, event);"><span></span></button>
                </div>
                <span class="close" onClick="searchToggle(this, event);"></span>
            </div>
        </form>
    </div>
    <!--=======================购物车==========================-->
    <div class="cart">
        <dl>
            <dt class="shopping-btn">
                <a href="">
                    <b class="totlePrice">￥2020.00</b>
                </a>
            </dt>
            <dd class="shopping-list" style="">
                <div class="spacer"></div>
                <div class="nogoods" style="display: none">
                    购物车中还没有商品，赶紧选购吧!
                </div>
                <div class="goods">
                    <ul>
                        <li>
                            <div class="l">
                                <a href="">
                                    <img src="${pageContext.request.contextPath}images/cart1.jpg" width="42" height="42">
                                </a>
                            </div>
                            <div class="c">
                                <a href="">
                                    PAMPERO乌拉那拉去骨冷冻安格斯谷饲薄群肉牛排150g
                                </a>
                            </div>
                            <div class="r">
                                <b>￥39.90</b>
                                *3
                                <a href="" onclick="">删除</a>
                            </div>
                        </li>
                        <li>
                            <div class="l">
                                <a href="">
                                    <img src="${pageContext.request.contextPath}images/cart1.jpg" width="42" height="42">
                                </a>
                            </div>
                            <div class="c">
                                <a href="">
                                    PAMPERO乌拉那拉去骨冷冻安格斯谷饲薄群肉牛排150g
                                </a>
                            </div>
                            <div class="r">
                                <b>￥39.90</b>
                                *3
                                <a href="" onclick="">删除</a>
                            </div>
                        </li>
                    </ul>
                    <div class="price-total">
                        <div>
                            <span class="totleNum">
                                共
                                <b>6</b>
                                件商品
                            </span>
                            <span class>
                                共计
                                <b class="totlePrice">￥120.00</b>
                            </span>
                        </div>
                    </div>
                </div>
            </dd>
        </dl>
    </div>

    <!--=======================我的====================================-->
    <div class="top-menu">
        <div class="login">
            <p>
                <a href="">登录/</a>
                <a href="">注册</a>
            </p>
        </div>
        <div class="user">
            <ul>
                <li class=" tle">
                    <a class="geren" href=""><img src="${pageContext.request.contextPath}images/geren-logo.png"></a>
                    <a href="">我的咸鱼</a>
                </li>
                <li class="e1">
                    <a class="order" href=""><img src="${pageContext.request.contextPath}images/order-logo.png"></a>
                    <a href=" ">我的订单</a>
                </li>
                <li class="e2">
                    <a class="coupon" href=""><img src="${pageContext.request.contextPath}images/coupon.png"></a>
                    <a href="">我的优惠券</a>
                </li>
                <li class="last">
                    <a class="exit" href=""><img src="${pageContext.request.contextPath}images/exit.png"></a>
                    <a href="">退出账户</a>
                </li>
            </ul>
        </div>
    </div>
</div>




<!--==================================中间部分====================================-->

<div class="pro-detail">

    <div class="crumbs">
        <a href="">首页 ></a>
        <a href="">新鲜水果 ></a>
        <a href="">苹果 ></a>
        <a href="">山东蓬莱红富士苹果9个约200g/个</a>
    </div>

    <div class="pic-preview">
        <img src="${pageContext.request.contextPath}images/pingguo.jpg">
    </div>

    <div class="product-info">
        <div class="summary-name">
            <h1>山东蓬莱红富士苹果9个约200g/个</h1>
            <p>皮薄肉脆 咔嚓一口好清脆</p>
        </div>

        <div class="price-clearfix">
            <div class="pro-price">
                <span class="tt">价格：</span>
                <span>
                    <em>￥</em>
                    <span>49.00</span>
                </span>
            </div>
            <div class="pro-m">
                <span class="ff">更多商品优惠，尽在咸鱼鲜生</span>
                <img src="${pageContext.request.contextPath}images/shouji.png">
                <span class="ss">手机下单立即购买</span>
                <span class="sm">立即扫码</span>
            </div>
            <div class="erweima">
                <img src="${pageContext.request.contextPath}images/erweima.png">
            </div>
            <div class="pro-review">
                <p>总体满意度</p>
                <span class="fen">5.0</span>
                <span>分</span>
                <p>(评论数100)</p>
            </div>

        </div>
    </div>

    <div class="other-clearfix">
        <div class="left">
            <div class="choose-clearfix">
                <div class="ll">
                    <span>规格：</span>
                </div>
                <div class="dd">
                    <div class="top">
                        <span>￥</span>
                        <span>49.00</span>
                    </div>
                    <div class="bot">
                        <span>9个/盒</span>
                    </div>

                </div>

            </div>

            <div class="service">
                <img src="${pageContext.request.contextPath}images/1.png">
                <span>不支持7天无理由退货</span>
            </div>

            <div class="amount">
                <div class="dt">
                    <span>数量：</span>
                </div>
                <div class="gt">
                    <div class="t">
                        <span>1</span>
                    </div>
                    <div class="kt">
                        <div class="tp">
                            <span>+</span>
                        </div>
                        <div class="btm">
                            <span>-</span>
                        </div>
                    </div>
                </div>
                <div class="add-car">
                    <img src="${pageContext.request.contextPath}images/addcar.png">
                    <a href="">加入购物车</a>
                </div>

            </div>

            <div class="right">
               <table width="100%" cellspacing="0" cellpadding="0" border="0" class="zx">
                   <tbody>
                   <tr>
                       <th>原产地：</th>
                       <td>山东</td>
                   </tr>
                   <tr>
                       <th>商品编号：</th>
                       <td>6000034322</td>
                   </tr>
                   <tr>
                       <th>品牌：</th>
                       <td>咸鱼</td>
                   </tr>
                   <tr>
                       <th>发货地：</th>
                       <td>上海宝山</td>
                   </tr>
                   </tbody>

               </table>
            </div>

        </div>


    </div>







</div>

<div class="main">
    <div class="detail-tab">
        <ul class="detail-ul">
            <li class="active"><a href="">商品详情</a> </li>
            <li class="detail-li">
                <a href="">用户评论</a>
                <span>100</span>
            </li>
        </ul>
    </div>
    <div class="picture-1">
        <img src="${pageContext.request.contextPath}/images/picture1.jpg">
    </div>
    <div class="picture-2">
        <img src="${pageContext.request.contextPath}/images/picture-2.jpg">
    </div>
    <div class="picture-3">
        <img src="${pageContext.request.contextPath}/images/picture3.jpg">
    </div>
    <div class="picture-4">
        <img src="${pageContext.request.contextPath}/images/picture4.jpg">
    </div>
    <div class="picture-5">
        <img src="${pageContext.request.contextPath}/images/picture5.jpg">
    </div>
    <div class="picture-6">
        <img src="${pageContext.request.contextPath}/images/picture6.jpg">
    </div>
</div>
<div class="footer">
    <div class="wrap">
      <div class="s1">
          <img src="${pageContext.request.contextPath}/images/quanqiu.png">
          <b>全球精选</b>
          <span>一站式生鲜购物方案</span>
      </div>
        <div class="s2">
            <img src="${pageContext.request.contextPath}/images/cangku.png">
            <b>多仓直发</b>
            <span>次日达配送服务</span>
        </div>
        <div class="s3">
            <img src="${pageContext.request.contextPath}/images/jingxuan.png">
            <b>品质严选</b>
            <span>精选正宗品质好食材</span>
        </div>
        <div class="s4">
            <img src="${pageContext.request.contextPath}/images/gouwu.png">
            <b>天天低价</b>
            <span>会员专属优惠购不停</span>
        </div>


    </div>

</div>

<script src="${pageContext.request.contextPath}/js/product_spec.js"></script>
</body>
</html>